<<<<<<< HEAD

Create a Heatmap with Customer color scale

import pandas as pd
import numpy as np
import plotly.express as px

df = pd.read_excel("DOHMH Dog Bite Data.xlsx", sheet_name="Bite Data")
df.head()

my_color_scale = [(0, '#1e6155'), (0.4, 'rgb(200, 200, 200)'), (1, '#7a214c')]

fig = px.density_heatmap(df, x='Gender', y='Borough', color_continuous_scale=my_color_scale)
fig.show()

Dashboard with layout

import pandas as pd # dataframes for reading and manipulating data
import plotly.express as px #Plotly Express for making graphs

from jupyter_dash import JupyterDash # For running Dash dashboard inline (not in a new window)
from dash import html # For using HTML tags like H1 for headings etc.
from dash import dcc # Provides interactive controls like dropdown boxes
import dash_bootstrap_components as dbc # Lets us use rows and cols for layout
from dash.dependencies import Input, Output # Provides the wiring between input and output

# Creating a Jupyter Dash object
app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

# Define rows and cols layout
row = html.Div([
        dbc.Row([
            dbc.Col(html.Div("Some text"), width=3),
            dbc.Col(html.Div("Some more text"), width=9)
               ])  # end of row 
              ])   #end of Outer Div

# Use the layout in the application 
app.layout = row

# Run the application
app.run_server(mode='inline')

Create a dcc.checklist

# df_temp = df['SpayedNeutered'].unique()

import pandas as pd # dataframes for reading and manipulating data
import plotly.express as px #Plotly Express for making graphs

from jupyter_dash import JupyterDash # For running Dash dashboard inline (not in a new window)
from dash import html # For using HTML tags like H1 for headings etc.
from dash import dcc # Provides interactive controls like dropdown boxes
import dash_bootstrap_components as dbc # Lets us use rows and cols for layout
from dash.dependencies import Input, Output # Provides the wiring between input and output

#-------------------------------------
# Read the dataset
df = pd.read_excel("DOHMH Dog Bite Data.xlsx", sheet_name="Bite Data")

#-------------------------------------
# Creating a Jupyter Dash object
app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

# Define rows and cols layout
row = html.Div([
        dbc.Row([
            dbc.Col(html.Div([dcc.Checklist(df['SpayedNeutered'].unique(), df['SpayedNeutered'].unique())
                            ]), width=3), # end of col 1
            dbc.Col(html.Div("some more text"), width=9),
        ])# end of row
    ])# end of outer Div

#-------------------------------------
# Use the layout in the application 
app.layout = row

# Run the application
app.run_server(mode='inline', port='9876')

Connect HeatMap to Check boxes

import pandas as pd # dataframes for reading and manipulating data
import plotly.express as px #Plotly Express for making graphs

from jupyter_dash import JupyterDash # For running Dash dashboard inline (not in a new window)
from dash import html # For using HTML tags like H1 for headings etc.
from dash import dcc # Provides interactive controls like dropdown boxes
import dash_bootstrap_components as dbc # Lets us use rows and cols for layout
from dash.dependencies import Input, Output # Provides the wiring between input and output

#-------------------------------------
# Read the dataset
df = pd.read_excel("DOHMH Dog Bite Data.xlsx", sheet_name="Bite Data")

my_color_scale = [(0, '#1e6155'), (0.4, 'rgb(200, 200, 200)'), (1, '#7a214c')]

#-------------------------------------
# Creating a Jupyter Dash object
app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

# Define rows and cols layout
row = html.Div([
        dbc.Row([
            dbc.Col(html.Div([dcc.Checklist(df['SpayedNeutered'].unique(), df['SpayedNeutered'].unique(), id='chk_SN')
                            ]), width=3), # end of col 1
            dbc.Col(html.Div(dcc.Graph(id='heatmap_count')), width=9),
        ])# end of row
    ])# end of outer Div

#-------------------------------------
# Use the layout in the application 
app.layout = row

#-------------------------------------
# callback
@app.callback(Output('heatmap_count', 'figure'),
              Input('chk_SN', 'value'))
def update_heatmap(options_SN):
    df_filtered = df[df['SpayedNeutered'].isin(options_SN)]
    fig = px.density_heatmap(df_filtered, x='Gender', y='Borough', color_continuous_scale=my_color_scale)
    return fig
#-------------------------------------
# Run the application
app.run_server(mode='inline', port='9875')

Stack checkboxes on top of each other

import pandas as pd # dataframes for reading and manipulating data
import plotly.express as px #Plotly Express for making graphs
from jupyter_dash import JupyterDash # For running Dash dashboard inline (not in a new window)
from dash import html # For using HTML tags Like H1 for headings etc.
from dash import dcc # Provides interactive controls like dropdown boxes
import dash_bootstrap_components as dbc # Lets us use rows and cols for Layout
from dash.dependencies import Input, Output # Provides the wiring between input and output

df = pd.read_excel("DOHMH Dog Bite Data.xlsx", sheet_name="Bite Data")

my_color_scale = [(0,'#1e6155'), (0.4,'rgb(200, 200, 200)'), (1, '#7a214c')]

app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

row = html.Div([
        dbc.Row([
            dbc.Col(html.Div([html.H5("Spayed or Neutered?"),
                              dcc.Checklist(options={'Y': '  yes',
                                                     'N': '  No'},
                                            value=['Y', 'N'], # setting what boxes should be checked
                                            labelStyle = dict(display='block'), # not in a row
                                            id='chk_SN')                
                            ]), width=3),#end of col 1
            dbc.Col(html.Div(dcc.Graph(id='heatmap_count')), width=9),
        ]) #end of Row
      ]) #end of outer Div


app.layout = row


@app.callback(Output('heatmap_count', 'figure'),
              Input('chk_SN', 'value'))
def update_heatmap(options_SN):
    df_filtered = df[df['SpayedNeutered'].isin(options_SN)]
    fig = px.density_heatmap(df_filtered, x='Gender', y='Borough', color_continuous_scale=my_color_scale)
    return fig

app.run_server(mode='inline', port=8876)

Create fixed labels for checkbox

import pandas as pd # dataframes for reading and manipulating data
import plotly.express as px #Plotly Express for making graphs

from jupyter_dash import JupyterDash # For running Dash dashboard inline (not in a new window)
from dash import html # For using HTML tags like H1 for headings etc.
from dash import dcc # Provides interactive controls like dropdown boxes
import dash_bootstrap_components as dbc # Lets us use rows and cols for layout
from dash.dependencies import Input, Output # Provides the wiring between input and output

#-------------------------------------
# Read the dataset
df = pd.read_excel("DOHMH Dog Bite Data.xlsx", sheet_name="Bite Data")

my_color_scale = [(0,'#f542ce'), (0.4,'rgb(200, 200, 200)'), (1, '#f5b642')]

#-------------------------------------
# Creating a Jupyter Dash object
app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

# Define rows and cols layout
row = html.Div([
        dbc.Row([
            dbc.Col(html.Div([html.H5("Spayed or Neutered?"),
                              dcc.Checklist(options={'Y': '  Yes',
                                                     'N': '  No'}, 
                                            value=['Y', 'N'], # setting what boxes should be checked
                                            labelStyle = dict(display='block'), # not in a row
                                            id='chk_SN')
                            ]), width=3), # end of col 1
            dbc.Col(html.Div(dcc.Graph(id='heatmap_count')), width=9),
        ])# end of row
    ])# end of outer Div

#-------------------------------------
# Use the layout in the application 
app.layout = row

#-------------------------------------
# callback
@app.callback(Output('heatmap_count', 'figure'),
              Input('chk_SN', 'value'))
def update_heatmap(options_SN):
    df_filtered = df[df['SpayedNeutered'].isin(options_SN)]
    fig = px.density_heatmap(df_filtered, x='Gender', y='Borough', color_continuous_scale=my_color_scale)
    return fig

# Run the application
app.run_server(mode='inline', port='8894')

======= >>>>>>> 62ad56c15afa3cabad39a3e747cdf723a9715b88